﻿<html xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html">
<head>
    <meta content="text/html; charset=UTF-8" http-equiv="content-type">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
    <link rel="icon" href="/favicon.ico" type="image/x-icon"/>
    <title>糕飞</title>

    <script type="text/javascript">

        //need change onbuttonclick targeturl

        function isWeixin() {
            var ua = navigator.userAgent.toLowerCase();
            if (ua.match(/MicroMessenger/i) == "micromessenger") {
                return true;
            } else {
                return false;
            }
        }

        var isiOS = navigator.userAgent.match('iPad')
                || navigator.userAgent.match('iPhone')
                || navigator.userAgent.match('iPod');
        var isAndroid = navigator.userAgent.match('Android');
        var isDesktop = !isiOS && !isAndroid;

        function onbuttonclick(sender) {


            if (isWeixin()) {
                targeturl = "https://itunes.apple.com/cn/app/kai-kai-hui-huo-dong-chang/id978279424?l=en&mt=8";
                window.open(targeturl);
                window.setTimeout(function () {
                    document.getElementById("modal_jump_background").style.display = "block";
                    document.getElementById("modal_jump").style.display = "block";
                    document.body.removeChild(ifr);
                }, 10);
            }
            else {
                if (isiOS) {
                    targeturl = "https://itunes.apple.com/cn/app/kai-kai-hui-huo-dong-chang/id978279424?l=en&mt=8";
                    var ifr = document.createElement('iframe');
                    ifr.src = targeturl;
                    ifr.style.display = 'none';
                    document.body.appendChild(ifr);
                    window.open(targeturl);
                }
                else if (isAndroid) {
                    targeturl = "http://fpdn.qiniudn.com/fotoplace.apk";
                    window.open(targeturl);
                }
                else {
//                    location = "../";
                    targeturl = "https://itunes.apple.com/cn/app/kai-kai-hui-huo-dong-chang/id978279424?l=en&mt=8";
                    window.open(targeturl);
                }
            }
        }


        function hidemodal() {
            document.getElementById("modal_jump_background").style.display = "none";
            document.getElementById("modal_jump").style.display = "none";
        }

    </script>

    <style>

        /********** bootstrap begin ************/
        p, pre {
            margin: 0 0 10px;
        }

        *, *:before, *:after {
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }

        body {
            font-family: "微软雅黑", "Helvetica Neue", Helvetica, Arial, sans-serif;
            font-size: 14px;
            line-height: 1.428571429;
            color: #333;
            margin: 0 0 0 0;
        }

        /********** bootstrap end ************/

        .sharepageFooterContainerContainer {
            position: fixed;
            width: 100%;
            bottom: 0px;
            /*bottom: -13px;*/
            min-width : 320 px;
            height: 105px;
            z-index: 199;
            margin-top: 30px;
        }

        .sharepageFooterContainer {
            margin: 0 auto;
            max-width: 500px;
            height: 105px;
            width: 100%;
            background-color: #7f7f7f;
            z-index: 199;
        }



        .sharepageFooter {
            /*position:fixed;
            bottom: -30px;
            height:220px;*/
            width: 100%;
            height: 100px;
            /*background-color:#434144;*/
            background-color: #535154;
            /*z-index:999;*/
            margin-top: 20px;
        }

        .sharepageFooter img {
            height: 50px;
            width: 50px;
            margin: 5px 0 0 7px;
            float: left;
        }

        .sharepageFooterMiddle {
            float: left;
            margin: 0px 0 0 10px; /* chenkai: 1px to 3px for delete last row */
        }

        .sharepageFooterBigfont {
            font-size: 18px;
            color: #fff;
            margin-bottom: 0px;
            margin-left: -10px;
        }

        .sharepageFooterSmallfont {
            font-size: 16px;
            color: #ffffff;
            margin: 0 0 0 -10px;
        }

        .sharepageFooterRight {
            float: right;
            /*margin: 4px 10px 0 0;*/
            margin: -55px 10px 0 0;
        }

        .btn-ios {
            display: block;
            -moz-border-radius: 0.2em /*{global-radii-buttons}*/;
            -webkit-border-radius: 0.2em /*{global-radii-buttons}*/;
            border-radius: 0.2em /*{global-radii-buttons}*/;
            text-decoration: none;

            font-size: 16px;
            /*font-weight: bold;*/
            color: #fff;
            background-color: #ff7477;
            padding: 5px 10px 5px 10px;
            margin: 65px 0 0 0;
            border: solid 1px #454346;

        }


        .modal_jump_background {
            -khtml-opacity: .58;
            -webkit-opacity: .58;
            opacity: .58;
            -moz-opacity: .58;
            filter: alpha(opacity=58);
            background-color: #000;
            position: fixed;
            z-index: 200;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
        }

        .modal_jump {
            position: fixed;
            z-index: 201;
            width: 100%;
            top: 0;
            left: 0;
        }

        body {
            width: 100%;
        }

        .rootContainer {

            margin: 0 auto;
            max-width: 500px;
            width: 100%;
            position: relative;
            border: solid 0px;
        }

        .coverImageContainer {
            width: 100%;

        }

        .coverImage {
            width: 100%;
            display: block;
        }

        .coverProvider {

            left: 17px;
            bottom: 34px;
            color: #fff;
            font: bold 15px/30px arial;
            height: 24px;
        }

        .providerAvatar {
            width: 25px;
            height: 25px;
            border: solid 1px;
            box-shadow: 1px 1px 1px gray;
            -moz-box-shadow: 1px 1px 1px gray;
            -webkit-box-shadow: 1px 1px 1px gray;
            -o-shadow: 1px 1px 1px gray;
        }

        .providerName {
            position: relative;
            margin-left: 4px;
            font-size: 11px;
            bottom: 1px;
            text-shadow: 2px 2px 2px gray;
        }



        .postUser {
            margin: 20px;
        }

        .postUserAvatar {
            /*width:30px;*/
            /*height:30px;*/
            border: solid 0px;
            box-shadow: 1px 1px 1px gray;
            -moz-box-shadow: 1px 1px 1px gray;
            -webkit-box-shadow: 1px 1px 1px gray;
            -o-shadow: 1px 1px 1px gray;
            float: left;

            width: 2.953125rem;
            height: 2.953125rem;
            border-radius: 4rem
        }



        .postUserName {
            position: relative;
            top: -2px;
            font-family: "Helvetica Neue", Helvetica, "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
            font-weight: bold;
            font-size: 12px;
            color: #4c4c4c;
        }



        .mianContainer {
            position: relative;
            top: 10px;
            padding: 0 0px 0 0px;
        }






        .contentText {
            margin: 15px 0 0 0;
        }

        .contentText pre {
            overflow: hidden;
            margin: 0 0px 0px 0px;
            max-width: 500px;
            font-size: 14px;
            color: #4C4C4C;
            word-wrap: break-word;
            white-space: pre-wrap;
            font-family: "微软雅黑", "Helvetica Neue", Helvetica, Arial, sans-serif;
        }

        .contentText a {
            color: #41aaf2;
        }

        .postTag {
            margin: 30px 0 0 0;
        }





        ul li {
            margin: 0;
            padding-top: 5px;
            padding-bottom: 27px;
            min-height: 35px;
            margin-bottom: 15px;
            padding-left: 80px;
            list-style: none;
            border-bottom-style: solid;
            border-bottom-width: 1px;
            border-bottom-color: #eaeaea;
        }

        .content {
            margin: 18px;
            margin-top: 0px;
            font-size: 16px;
            color: #666666;
        }

        .like {

            margin-left: 20px;
            width: auto;
            height: 30px;
        }

        .likes {
            margin-top: 20px;
        }



        .images {
            margin-left: 20px;
        }

        .likesCount {
            float: right;
            border: 1px solid #eeeeee;
            height: 30px;
            width: 50px;
            margin: 8px;
            padding: 0 7px;
            line-height: 27px;
            text-align: center;
            background-color: #e9e9e9;
        }

    </style>

</head>


<body>


<div class="rootContainer">

    <div class="mianContainer">
        <div class="header" style="display:block;">
            <div class="postUser">
                <img class="postUserAvatar"
                     src="${appUser.headImage}"></img>

                <div style="  float: left;
                        margin-left: 20px;">
                    <div class="postUserName">${appUser.name}</div>
                    <div class="postTime">${news.createTime?string("yyyy-MM-dd hh:mm")}</div>
                </div>
                </br>
                <div style="clear:both;"></div>
            </div>
        </div>
        <div class="contentText" style="display:none;">
            <pre></pre>
        </div>
        <div class="postTag">


            <div style="clear:both;"></div>
        </div>
        <div class="footerHolderClass">
        </div>
    </div>

    <div class="coverImageContainer">
    <#if imageList?size!=0>
        <#list imageList as e>
            <div><img class="coverImage" src="${e.path}"></img></div>
            <div class="coverProvider" style="display:block;opacity:0;width:calc(100%-70px);">
                <img class="providerAvatar" src=""></img>
                <span class="providerName"></span>
            </div>


            <div class="content">${news.content}</div>
            <div>
                <img src="${BASE_PATH}/static/assets/share/img/like.png" class="like">
            </div>
            <div class="likes" style="display: block">

                <div>
                    <#if (headImageList?size!= 0)>
                        <#list headImageList as e>
                            <#if e_index lt 6>
                                <img src="${e}" class="postUserAvatar images"> </img>
                            </#if>
                        </#list>
                    </#if>

                </div>
            <span class="likesCount">
            ${likesCount}
            </span>

            </div>
        </#list>
    </#if>

    </div>




</div>




<div class="sharepageFooterContainerContainer" id="idSharepageFooterContainerContainer">

    <div class="sharepageFooterContainer" style="display:block;">

        <div class="sharepageFooter">

            <a onclick="onbuttonclick()"
               id="openApp"
               targeturl=""
               href="javascript:void(0);">
                <div style="padding-top:8px;"><img src="${BASE_PATH}/static/assets/share/img/icon.png"></div>


                <div class="sharepageFooterMiddle" style="width:calc(100% - 70px);">
                    <div class="sharepageFooterMiddle" style="width:100%;">
                        <div class="sharepageFooterMiddle">
                            <p class="sharepageFooterBigfont">糕飞</p>

                            <p class="sharepageFooterSmallfont">分享蛋糕的乐趣</p>
                        </div>

                        <div class="sharepageFooterRight">
                            <p class="btn-ios">马上下载</p>
                        </div>
                    </div>

                </div>
            </a>
        </div>
    </div>

</div>


<div id="modal_jump_background" class="modal_jump_background" style="display:none;" onclick="hidemodal()">
</div>
<img id="modal_jump" class="modal_jump" style="display:none;"
     src="${BASE_PATH}/assets/share/img/weixinfallback_background.png?t=342" onclick="hidemodal()"></img>

<script>
    window.onload = function () {
        var isIOS = ( navigator.userAgent.match(/(iPad|iPhone|iPod)/g) ? true : false );
        div = document.getElementById("openApp");
        if (isIOS) {
            //div.setAttribute("targetUrl","https://itunes.apple.com/app/id877174386?mt=8");
            //div.setAttribute("href","https://itunes.apple.com/app/id877174386?mt=8");
            //div.setAttribute("targetUrl", "http://fotoplace.cc/download");
            //div.setAttribute("href", "http://fotoplace.cc/download");
        }
        else {
            //div.setAttribute("targetUrl", "http://fotoplace.cc/download");
            //div.setAttribute("href", "http://fotoplace.cc/download");
        }
        div = document.getElementById("idSharepageFooterContainerContainer");
        div.style.bottom = "-13px";
    }
</script>

</body>
</html>